<template>
  <div id="OrdersTitle">
    <v-details
      :inputConfig="inputConfig"
      :detailData="data.detailData"
      :rules="rules"
      @pop="setdata"
      ref="input"
    ></v-details>
  </div>
</template>

<script>
import details from "commons/Detail";
import baseMixin from "@/mixins/BaseMixin";

export default {
  props: {
    data: {
      type: Object,
    },
  },
  mixins: [baseMixin],
  name: "OrdersTitle",
  data() {
    return {
      rules: {},
    };
  },
  computed: {
    inputConfig() {
      return [
        [
          {
            type: "table",
            label: this.$t("config.shipper"),
            props: "storerkey1",
            tableConfig: [
              {
                label: this.$t("config.shipper"),
                prop: "storerkey",
                input: "input",
              },
              {
                label: this.$t("config.company"),
                prop: "company",
                input: "input",
              },
              {
                label: this.$t("config.city"),
                prop: "city",
                input: "input",
              },
              {
                label: this.$t("config.provice"),
                prop: "state",
                input: "input",
              },
              {
                label: this.$t("config.postcode"),
                prop: "zip",
                input: "input",
              },
              {
                label: this.$t("config.contact"),
                prop: "contact",
                input: "input",
              },
              {
                label: this.$t("config.phone"),
                prop: "phone",
                input: "input",
              },
            ],
            url: `/queryStorer/1/?/${this.$store.state.wms}`,
          },
          {
            type: "table",
            label: this.$t("config.sku"),
            props: "sku1",
            tableConfig: [
              {
                label: this.$t("config.sku"),
                prop: "sku",
                input: "input",
              },
            ],
            url: `/querySku/?/${this.$store.state.wms}`,
          },
          {
            type: "table",
            label: this.$t("config.loc"),
            props: "loc1",
            tableConfig: [
              {
                label: this.$t("config.loc"),
                prop: "loc",
                input: "input",
              },
            ],
            url: `/queryLoc/`,
          },
          {
            type: "table",
            label: this.$t("config.area"),
            props: "area1",
            tableConfig: [
              {
                label: this.$t("config.area"),
                prop: "putawayzone",
                input: "input",
              },
            ],
            url: `/queryPutawayzone/`,
          },
          /* {
                            type: "select",
                            label: this.$t('common.locabcinclude01'),
                            props: "locABC",
                            options: [
                                {code: 'A', description: this.$t('code.abc1')},
                                {code: 'B', description: this.$t('code.abc2')},
                                {code: 'C', description: this.$t('code.abc3')},
                                {code: '0', description: this.$t('code.null')}
                            ]
                        },
                        {
                            type: "select",
                            label: this.$t('outbound.skuabcinclude01'),
                            props: "skuABC",
                            options: [
                                {code: 'A', description: this.$t('code.abc1')},
                                {code: 'B', description: this.$t('code.abc2')},
                                {code: 'C', description: this.$t('code.abc3')},
                                {code: '0', description: this.$t('code.null')}
                            ]
                        },*/
          {
            type: "checkbox",
            label: this.$t('ex.includeEmptyLoc'),
            props: "empty",
          },
        ],
        [
          {
            type: "table",
            label: this.$t("config.shipper"),
            props: "storerkey2",
            tableConfig: [
              {
                label: this.$t("config.shipper"),
                prop: "storerkey",
                input: "input",
              },
              {
                label: this.$t("config.company"),
                prop: "company",
                input: "input",
              },
              {
                label: this.$t("config.city"),
                prop: "city",
                input: "input",
              },
              {
                label: this.$t("config.provice"),
                prop: "state",
                input: "input",
              },
              {
                label: this.$t("config.postcode"),
                prop: "zip",
                input: "input",
              },
              {
                label: this.$t("config.contact"),
                prop: "contact",
                input: "input",
              },
              {
                label: this.$t("config.phone"),
                prop: "phone",
                input: "input",
              },
            ],
            url: `/queryStorer/1/?/${this.$store.state.wms}`,
          },
          {
            type: "table",
            label: this.$t("config.sku"),
            props: "sku2",
            tableConfig: [
              {
                label: this.$t("config.sku"),
                prop: "sku",
                input: "input",
              },
            ],
            url: `/querySku/?/${this.$store.state.wms}`,
          },
          {
            type: "table",
            label: this.$t("config.loc"),
            props: "loc2",
            tableConfig: [
              {
                label: this.$t("config.loc"),
                prop: "loc",
                input: "input",
              },
            ],
            url: `/queryLoc/`,
          },
          {
            type: "table",
            label: this.$t("config.area"),
            props: "area2",
            tableConfig: [
              {
                label: this.$t("config.area"),
                prop: "putawayzone",
                input: "input",
              },
            ],
            url: `/queryPutawayzone/`,
          },
        ],
      ];
    },
  },
  methods: {
    setdata(data, id, close, listId) {
      if (listId == "0") {
        if (id == "0") {
          this.data.detailData.storerkey1 = data.storerkey;
        } else if (id == "1") {
          this.data.detailData.sku1 = data.sku;
        } else if (id == "2") {
          this.data.detailData.loc1 = data.loc;
        } else if (id == "3") {
          this.data.detailData.area1 = data.putawayzone;
        }
      } else if (listId == "1") {
        if (id == "0") {
          this.data.detailData.storerkey2 = data.storerkey;
        } else if (id == "1") {
          this.data.detailData.sku2 = data.sku;
        } else if (id == "2") {
          this.data.detailData.loc2 = data.loc;
        } else if (id == "3") {
          this.data.detailData.area2 = data.putawayzone;
        }
      }
      close(false);
    },
  },
  mounted() {},
  watch: {},
  components: {
    "v-details": details,
  },
};
</script>

<style scoped></style>
